<%@ page language="java" import="java.util.*" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@include file="/context/mytags.jsp"%>
<!DOCTYPE html>
<html>
 <head>
  <title>上传文件</title>
  <t:base type="jquery,easyui,tools,DatePicker"></t:base>
   <script src="plug-in/jquery-plugs/form/jquery.form.js"></script>
  <script type="text/javascript" charset="utf-8" src="plug-in/ueditor/ueditor.config.js"></script>
   <script type="text/javascript" charset="utf-8" src="plug-in/ueditor/ueditor.all.min.js"> </script> 
   <script type="text/javascript" charset="utf-8" src="plug-in/ueditor/lang/zh-cn/zh-cn.js"></script>
   <script type="text/javascript" src="plug-in/Validform/js/Validform_v5.3.1_min_zh-cn.js"></script>
   <script type="text/javascript" src="plug-in/Validform/js/Validform_Datatype_zh-cn.js"></script>
   <script type="text/javascript" src="plug-in/Validform/js/datatype_zh-cn.js"></script>
   <link rel="stylesheet" href="plug-in/Validform/css/style.css" type="text/css">
   <link rel="stylesheet" href="plug-in/Validform/css/tablefrom.css" type="text/css">
   
  	<style>
  		.prevImg{
  			float:left;
  			margin:2px;
  		}
  		.prevImg a{
  			display: block;
    		text-align: center;
    		cursor:pointer;
    		color:rgb(0,162,212)
  		}
  	</style>
 </head>
 <body>
 
  <form id="formobj" enctype="multipart/form-data" action="teachItemPreviewController.do?doTempletAdd" name="formobj" method="post">
  		<input type="hidden" id="btn_sub" class="btn_sub">
  		<input type="hidden" id="id" name="id" value="${obj.id}"/>
					 
		<table style="" cellpadding="0" cellspacing="1" class="formtable">
			<tbody>
				<tr>
					<td align="right">
						<label class="Validform_label">
							文件:
						</label>
					</td> 
					<td class="value"> 
		         		
		         		<c:forEach items="${attList}" var="att">
		         			<div class="prevImg" id="prevImg${att.id}">
		         				<label>${att.origFileName }</label>
		         				<a onclick='deleteAttach(${att.id})'>删&nbsp;除</a>
		         			</div>  	 
		         		</c:forEach>
		         		<input name="file" type="file"  accept=".xls,.xlsx"/>
						<button type="button" onclick="uploadFile('formobj')">上传</button>
		           </td> 
			  </tr>
			</tbody>
		</table>
		</form>
		
		<script>
			
			 $(document).ready(function () {
				// ajaxSubmit
				$("#btn_sub").click(function () {
				     $("#formobj").ajaxSubmit({success: function (data) {
				    	data = $.parseJSON(data);
				        if(data.success){
				        	window.top.tip("保存成功！");
				        	frameElement.api.opener.reloadTable();
				        	frameElement.api.close();
				        }else{
				        	tip(data.msg);
				        }
					 }});
				});
			});
			
			function deleteAttach(id){
				 $('#prevImg'+id).remove();
				 $('#formobj').append("<input type='hidden' name='deletedAttach'  value='"+id+"'/>");
			}
			
			function uploadFile(formId){
				if(typeof($('#'+ formId +' [name="file"]')[0].files[0]) == 'undefined'){
					tip('没有选择文件');
					return;
				}	
				var formData = new FormData();
				formData.append('file', $('#'+ formId +' [name="file"]')[0].files[0]);
				$.ajax({
				    url: 'cms-attach.do?upload',
				    type: 'POST',
				    cache: false,
				    data: formData,
				    dataType: 'json',
				    processData: false,
				    contentType: false,
				    success: function(data){
						if(data.success){
							$("#"+formId).append('<input type="hidden" name="attachId" value="'+ data.msg +'">');
							tip('上传成功');
							return;
						}else{
							tip(data.msg);
						}
					}
				});
			}
		 
		</script>
 </body>
 